/*
 * TODO: Huge service issue here, yahoo periodically gives error 999, psnapi.com gives 403 access denied periodically.  Look into workarounds or this app won't be happiness!
 * TODO: Add full login + auto-pop friends
 * TODO: Use html escape utility
 * TODO: Clean up css, what is enyo-bg??
 * TODO: Add individual trophy view
 * TODO: Reset scroller and list item data before switching views, to avoid confusion
 * TODO: Organize folder structure, resources as props etc...
 * TODO: Add "Date Earned"
 * TODO: Add hidden trophy option
 * 
 * Known Issue: In Enyo 2.0, it looks like an Image control will not render if it, or its parent, use the column layout.  Workaround is to 
 *              always wrap images in their own row layout.
 */
enyo.kind({
  name: "PsnTrophies.Shell",
  kind: "enyo.Control",
  classes: "onyx",
  components: [
	  /*{kind: "onyx.GroupboxHeader", components: [
	      {name: "commonHeader", kind: onyx.Groupbox},
	  	   {name: "backButton", kind: onyx.Button, content: "Back", ontap: "goBack"}
	  ]},*/
	  {name: "friendsPane", kind: "enyo.Slideable", draggable: false, unit: "%", classes: "enyo-fit", style: "width: 33%; background: red;", components: [
         {name: "friendsView", kind: "PsnTrophies.Friends", onSelect: "friendSelected"}
     ]},
     {name: "gamesPane", kind: "enyo.Slideable", min: 0, value: 100, max: 100, unit: "%", classes: "enyo-fit", style: "width: 33%; box-shadow: -6px 0px 6px rgba(0,0,0,0.3);", components: [
         {name: "gamesView", kind: "PsnTrophies.Games", onSelect: "gameSelected", className: "enyo-bg"}
	  ]},
     {name: "trophiesPane", kind: "enyo.Slideable", min: 100, value: 200, max: 200, unit: "%", classes: "enyo-fit", style: "width: 33%; background: green; box-shadow: -6px 0px 6px rgba(0,0,0,0.3);", components: [
         {content: "even more stuff"},
			//{name: "trophiesView", kind: "   PsnTrophies.Trophies", className: "enyo-bg"}
      ]}
	],
	create: function() {
      this.inherited(arguments);
      // NoEnyo - this.$.pane.selectViewByName("friendsView");
	},
   friendSelected: function(inSender, selectedFriend) {
	  this.log("Friend selected: '" + selectedFriend.psnid + "', switching to gamesView");
	  this.$.gamesView.getGamesService(selectedFriend.psnid);
	  // Put back - this.$.commonHeader.setContent(selectedFriend.psnid + "'s Games");
	  // NoEnyo - this.$.pane.selectViewByName("gamesView");
   },
	gameSelected: function(inSender, selectedGame) {
	  this.log("Game selected, switching to trophiesView");
	  this.$.trophiesView.getTrophiesService(this.$.gamesView.getSelectedPsnId(), selectedGame);
	  this.$.commonHeader.setContent(selectedGame.Title);
	  this.$.pane.selectViewByName("trophiesView");
	},
	viewSelected: function(inSender, inView) {
		if (inView == this.$.friendsView) {
			this.$.commonHeader.setContent("Friends");
			this.$.backButton.hide();
		} else if (inView == this.$.gamesView) {
		   this.$.backButton.show();
		} else if (inView == this.$.trophiesView) {
		   this.$.backButton.show();
		}
	},
	goBack: function(inSender, inEvent) {
		this.log("Shell.goBack(): Back button clicked");
    this.$.pane.back(inEvent);
	}
});
	